
// copy from weui
// --------------------------------------------------

.weui-cells {
  margin-top: @weuiCellsMarginTop;
  background-color: @weuiCellBg;
  line-height: @weuiCellLineHeight;
  font-size: @weuiCellFontSize; //cell中间有效高度23px，跟客户端默认图标尺寸一致

  overflow: hidden; //因为每个cell的border使用before元素left搞的，ie下伪元素的containing block估计跟标准不同，在cell上用oh不生效

  // onepx
  position: relative;
  &:before {
    .setTopLine(@weuiCellBorderColor);
  }
  &:after {
    .setBottomLine(@weuiCellBorderColor);
  }
}

.weui-cells-title {
  margin-top: .77em; // 15px - 行高
  margin-bottom: .3em; // 8px - 行高
  padding-left: @weuiCellGapH;
  padding-right: @weuiCellGapH;
  color: @weuiTextColorGray;
  font-size: @weuiCellTipsFontSize;

  & + .weui-cells {
    margin-top: 0;
  }
}

.weui-cells-tips {
  margin-top: .3em; // 8px - 行高
  color: @weuiTextColorGray;
  padding-left: @weuiCellGapH;
  padding-right: @weuiCellGapH;
  font-size: @weuiCellTipsFontSize;
}

.weui-cell {
  padding: @weuiCellGapV @weuiCellGapH;
  position: relative; //这个是为了兼容cells容器onepx方案被before挡住而做的
  display: flex;
  align-items: center;
  &:before {
    .setTopLine(@weuiCellBorderColor);
    left: @weuiCellGapH;
  }
  &:first-child {
    &:before {
      display: none;
    }
  }
}

.weui-cell-primary{
  align-items: flex-start;
}

.weui-cell-bd{
  flex: 1;
}

.weui-cell-ft {
  text-align: right;
  color: @weuiTextColorGray;
}

// weui form-common
.weui-label{
  color: #4b4b4b; // way
  display:block;
  width:@weuiCellLabelWidth;
  .text_wrap();
}

.weui-input {
  width: 100%;
  border: 0;
  outline: 0;
  -webkit-appearance: none;
  background-color: transparent;
  font-size: inherit;
  // color: inherit; // way
  color: #4b4b4b; //#828282;
  height: unit(@weuiCellLineHeight, em);
  line-height: @weuiCellLineHeight;

  // hides the spin-button
  &::-webkit-outer-spin-button, &::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
  }
}

.weui-textarea {
  display: block;
  border: 0;
  resize: none;
  width: 100%;
  color: inherit;
  font-size: 1em;
  line-height: inherit;
  outline: 0;
}

.weui-textarea-counter{
  color: @weuiTextColorTips;
  text-align: right;
  .weui-cell_warn &{
    color: @weuiTextColorWarn;
  }
}

.weui-toptips {
  display:none;
  position: fixed;
  transform: translateZ(0);
  top: 0;
  left: 0;
  right: 0;
  padding:5px;
  font-size:14px;
  text-align: center;
  color: #FFF;
  z-index: 5000;
  .text_wrap();
}

.weui-toptips-warn {
  background-color: @weuiColorWarn;
}

.weui-cells-form {
  .weui-cell-ft{
    font-size:0;
  }
  .weui-icon-warn{
    display:none;
  }
  input, textarea, label[for]{
    .setTapColor();
  }
}

.weui-cell-warn{
  color:@weuiTextColorWarn;
  .weui-icon-warn{display:inline-block;}
}

// weui-select

.weui-cell-select {
  padding: 0;
  .weui-select {
    padding-right: 30px;
  }
  .weui-cell-bd{
    &:after{
      content: " ";
      .setArrow(right, 6px, #C8C8CD, 2px);

      position: absolute;
      top: 50%;
      right: @weuiCellGapH;
      margin-top: -4px;
    }
  }
}

.weui-select {
  -webkit-appearance: none;
  border: 0;
  outline: 0;
  background-color: transparent;
  width: 100%;
  font-size: inherit;
  height: @weuiCellHeight;
  line-height: @weuiCellHeight;
  position: relative;
  z-index: 1;
  padding-left: @weuiCellGapH;
}

.weui-cell-select-before {
  padding-right:@weuiCellGapH;
  .weui-select{
    width:@weuiCellLabelWidth;
    box-sizing: border-box;
  }
  .weui-cell-hd {
    position:relative;
    &:after {
      .setRightLine(@weuiCellBorderColor);
    }
    &:before{
      content: " ";
      .setArrow(right, 6px, #C8C8CD, 2px);

      position: absolute;
      top: 50%;
      right: @weuiCellGapH;
      margin-top: -4px;
    }
  }
  .weui-cell-bd {
    padding-left:@weuiCellGapH;
    &:after{
      display:none;
    }
  }
}

.weui-cell-select-after {
  padding-left:@weuiCellGapH;
  .weui-select {
    padding-left:0;
  }
}